<!DOCTYPE html>
<html>

<head>
    <title>会员管理</title>
    <#include "/header.html">
</head>

<body>
<div id="app" v-cloak>
        <!--查询-->
        <el-form :inline="true" v-model="q" size="small">
            <el-form-item>
                <el-input v-model.trim="q.username" placeholder="会员名称"></el-input>
            </el-form-item>
            <el-button type="primary" size="small" icon="el-icon-search" @click="search"></el-button>
            <el-button type="primary" size="small" @click="rest">重置</el-button>
            <el-button type="primary" size="small" @click="add">新增</el-button>

            <div style="float: right; padding-right: 20px">
                <el-button type="primary" size="small" @click="accountCustomer">挂账客户</el-button>
                <el-button type="primary" size="small" @click="twbCustomer">图文宝会员</el-button>
                <el-button type="primary" size="small" @click="mallCustomer">商城会员</el-button>
            </div>
        </el-form>

        <el-row>
            <el-col :span="4" :offset="1">
                <span style="color: red">最近5天新增会员总数: {{allCount}}</span>
            </el-col>
            <el-col :span="4">
                <span style="color: red">商城新增: {{mallCount}}</span>
            </el-col>
            <el-col :span="4">
                <span style="color: red">图文宝新增: {{twbCount}}</span>
            </el-col>
        </el-row>
        <!--表格-->
        <el-table ref="tableData" :data="tableData" border highlight-current-row class="tb-edit" :default-sort="{prop: 'sid', order: 'ascending'}" @selection-change="handleSelectionChange" @row-click="handleclick" size="small">
            <el-table-column type="index" label="序号"></el-table-column>
            <!--<el-table-column prop="memberId" label="会员ID"></el-table-column>-->
            <el-table-column prop="name" label="会员名称">
                <template slot-scope="scope">
                    <el-button type="text" size="small" @click="showDetail(scope.row)">{{scope.row.name}}</el-button>
                </template>
            </el-table-column>
            <el-table-column prop="merchantsSource" label="会员类型" :formatter="merchantsSourceFormatter"></el-table-column>
            <el-table-column prop="createTime" label="创建时间"></el-table-column>
            <el-table-column prop="hangsAccountCustomer" label="挂账客户" :formatter="hangsAccountCustomerFormatter"></el-table-column>
            <el-table-column prop="priceSetName" label="价格账套"></el-table-column>
            <el-table-column prop="nickname" label="用户名"></el-table-column>
            <el-table-column prop="addr" label="地址" show-overflow-tooltip></el-table-column>
            <el-table-column prop="mobile" label="手机"></el-table-column>
            <el-table-column label="操作">
                <template scope="scope">
                    <el-button size="small" type="primary" @click="update(scope.$index, scope.row)">编辑</el-button>
                </template>
            </el-table-column>
        </el-table>
        <div align="center">
            <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage"
             :page-sizes="[20, 50, 80, 100]" :page-size="pagesize"  layout="total, sizes, prev, pager, next, jumper" :total="totalCount" background>
            </el-pagination>
        </div>

    <!--弹框-->
    <el-dialog :title="title" :visible.sync="dialogFormVisible" width="25%">
        <el-form :label-position="labelPosition" label-width="80px" :model="storeMember" ref="ruleForm" size="small">
            <el-row>
                <el-col :span="20" :offset="1"><div class="grid-content bg-purple-dark">
                    <el-form-item label="会员名"  prop="name" :rules="[{ required: true, message: '请输入会员名', trigger: 'blur' }]">
                        <el-input v-model.trim="storeMember.name" style="width: 200px" :readonly="storeMember.sid"></el-input>
                    </el-form-item>
                    <el-form-item label="联系人" prop="nickname" :rules="[{ required: true, message: '请输入联系人', trigger: 'blur' }]">
                        <el-input v-model.trim="storeMember.nickname" style="width: 200px" :readonly="title=='用户详情'||storeMember.merchantsSource==0"></el-input>
                    </el-form-item>
                    <el-form-item label="联系方式" prop="mobile" :rules="[{ required: true, message: '请输入手机号', trigger: 'blur' }]">
                        <el-input v-model.trim="storeMember.mobile" style="width: 200px" :readonly="title=='用户详情'||storeMember.merchantsSource==0"></el-input>
                    </el-form-item>
                    <el-form-item label="挂账客户">
                        <el-select v-model="storeMember.hangsAccountCustomer" placeholder="请选择" style="width: 200px" :disabled="title=='用户详情'||storeMember.merchantsSource==0">
                            <el-option label="否" :value=0></el-option>
                            <el-option label="是" :value=1></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="价格账套">
                        <el-select v-model="storeMember.priceSet" placeholder="请选择" style="width: 200px" :disabled="title=='用户详情'">
                            <el-option label="无" value=""></el-option>
                            <el-option v-for="item in storeFavouredPriceEntityList" :key="item.value" :label="item.favouredName" :value="item.favouredId"></el-option>
                        </el-select>
                    </el-form-item>
                </div></el-col>
            </el-row>
        </el-form>



        <!--<el-form :inline="true" label-width="70px" :model="storeMember" ref="ruleForm" :label-position="labelPosition">-->
            <!--<el-row>-->
                <!--<el-col :span="5" >-->
                    <!--<el-form-item label="会员名" prop="name" :rules="[{ required: true, message: '请输入会员名', trigger: 'blur' }]">-->
                        <!--<el-input v-model.trim="storeMember.name" :readonly="storeMember.sid"></el-input>-->
                    <!--</el-form-item>-->
                <!--</el-col>-->
            <!--</el-row>-->
            <!--<el-row>-->
                <!--<el-col :span="8" >-->
                    <!--<el-form-item label="联系人" prop="nickname"> &lt;!&ndash;:rules="[{ required: true, message: '请输入联系人', trigger: 'blur' }]"&ndash;&gt;-->
                        <!--<el-input v-model.trim="storeMember.nickname" :readonly="title=='用户详情'||storeMember.merchantsSource==0"></el-input>-->
                    <!--</el-form-item>-->
                <!--</el-col>-->
            <!--</el-row>-->
            <!--<el-row>-->
                <!--<el-col :span="8" >-->
                    <!--<el-form-item label="联系方式" prop="mobile"> &lt;!&ndash;:rules="[{ required: true, message: '请输入手机号', trigger: 'blur' }]"&ndash;&gt;-->
                        <!--<el-input v-model.trim="storeMember.mobile" :readonly="title=='用户详情'||storeMember.merchantsSource==0"></el-input>-->
                    <!--</el-form-item>-->
                <!--</el-col>-->
            <!--</el-row>-->
            <!--<el-row>-->
                <!--<el-col :span="5" >-->
                    <!--<el-form-item label="挂账客户" prop="hangsAccountCustomer">-->
                        <!--<el-select v-model="storeMember.hangsAccountCustomer" placeholder="请选择" :disabled="title=='用户详情'||storeMember.merchantsSource==0">-->
                            <!--<el-option label="否" :value=0></el-option>-->
                            <!--<el-option label="是" :value=1></el-option>-->
                        <!--</el-select>-->
                    <!--</el-form-item>-->
                <!--</el-col>-->
                <!--<el-col :span="5">-->
                    <!--<el-form-item label="价格账套" prop="priceSet">-->
                        <!--<el-select v-model="storeMember.priceSet" placeholder="请选择" :disabled="title=='用户详情'">-->
                            <!--<el-option label="无" value=""></el-option>-->
                            <!--<el-option v-for="item in storeFavouredPriceEntityList" :key="item.value" :label="item.favouredName" :value="item.favouredId"></el-option>-->
                        <!--</el-select>-->
                    <!--</el-form-item>-->
                <!--</el-col>-->
            <!--</el-row>-->
        <!--</el-form>-->
        <div slot="footer" class="dialog-footer">
            <el-button type="primary" size="small" @click="saveOrUpdate('ruleForm')" v-show="title!='用户详情'">确定</el-button>
            <el-button type="primary" size="small" @click="dialogFormVisible=!dialogFormVisible,$refs.ruleForm.resetFields()">返回</el-button>
        </div>
    </el-dialog>
</div>


<script src="${request.contextPath}/statics/js/modules/storeMember/twbStoreMember.js?_${.now?long}"></script>
</body>
</html>